import React,{Component} from 'react';
//import store from './store.js'
import {Button} from 'antd'

import {connect} from 'react-redux'

import {add,minus,asyncAdd} from './reducer'

/*
class StoreView extends Component{
   /!* render(){
        return <div>
            <p>{store.getState()}</p>
            <Button type='primary' onClick={()=>store.dispatch({type:'add'})}>add</Button>
            <Button type='primary' onClick={()=>store.dispatch({type:'minus'})}>minus</Button>
        </div>
    }*!/
    render(){
        return <div>
            <p>{this.props.num}</p>
            <Button type='primary' onClick={this.props.add} >add</Button>
            <Button type='primary' onClick={this.props.minus}>minus</Button>
        </div>
    }
}

const mapState2Props = state=>{
    return {num:state}
};

const mapDispacth2Props=dispatch=>{
    return {
        add:()=>dispatch({type:'add'}),
        minus:()=>dispatch({type:'minus'}),
    }
};

export default connect(mapState2Props,mapDispacth2Props)(StoreView);
*/
/*@connect(
    state=>({num:state}),
    dispatch=>({
        add:()=>{dispatch({type:'add'})},
        minus:()=>{dispatch({type:'minus'})},
        asyncAdd:()=>{
            setTimeout(()=>dispatch({type:'add'}),2000)
        }
    })
)*/
/*@connect(
    state=>({num:state}),
    {
        add:()=>({type:'add'}),
        minus:()=>({type:'minus'}),
        asyncAdd:()=>dispatch=>{
            setTimeout(()=>dispatch({type:'add'}),3000)
        }
    }
)*/
@connect(
    state=>({num:state}),
    {
        add,
        minus,
        asyncAdd
    }
)
class StoreView extends Component{
    /* render(){
         return <div>
             <p>{store.getState()}</p>
             <Button type='primary' onClick={()=>store.dispatch({type:'add'})}>add</Button>
             <Button type='primary' onClick={()=>store.dispatch({type:'minus'})}>minus</Button>
         </div>
     }*/
    render(){
        return <div>
            <p>{this.props.num}</p>
            <Button type='primary' onClick={this.props.add} >add</Button>
            <Button type='primary' onClick={this.props.minus}>minus</Button>
            <p><Button type={'primary'} onClick={this.props.asyncAdd}>asyncAdd</Button></p>
        </div>
    }
}


export default StoreView;

